<template>
  <div>
    <h1>我的代办</h1>
    <el-form :inline="true" :model="formInline" class="demo-form-inline">
    </el-form>
    <template>
      <el-table
          :data="tableDBdata"
          border
          style="width: 100%">
        <el-table-column
            fixed
            prop="name"
            label="请假人"
            width="150">
        </el-table-column>
        <el-table-column
            prop="createTime"
            label="请假开始时间"
            width="120">
        </el-table-column>
        <el-table-column
            prop="endTime"
            label="请假结束时间"
            width="120">
        </el-table-column>
        <el-table-column
            prop="type"
            label="请假类型"
            width="120">
        </el-table-column>
        <el-table-column
            prop="reason"
            label="请假原因"
            width="120">
        </el-table-column>
        <el-table-column
            prop="days"
            label="请假天数"
            width="120">
        </el-table-column>
        <el-table-column
            prop="content"
            label="审批意见"
            width="120">
        </el-table-column>
        <el-table-column
            fixed="right"
            label="操作"
            width="100">
          <template slot-scope="scope">
            <el-button @click="handleClick(scope.row.id)" type="text" size="small">审批</el-button>
          </template>
        </el-table-column>
      </el-table>
    </template>

    <el-dialog title="审批" :visible.sync="dialogFormVisible">
      <el-form :model="form">

        <el-form-item label="讲师审批" label-width="80px"  v-if="hh">
          <el-select v-model="form.jiangshi" placeholder="请选择">
            <el-option
                v-for="item in jiangshi"
                :key="item.userId"
                :label="item.userName"
                :value="item.userId">
            </el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="导员审批" label-width="80px"  v-if="jj">
          <el-select v-model="form.daoyuan" placeholder="请选择">
            <el-option
                v-for="item in daoyuan"
                :key="item.userId"
                :label="item.userName"
                :value="item.userId">
            </el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="审批意见" :label-width="formLabelWidth">
          <el-input
              type="textarea"
              :rows="2"
              placeholder="请输入内容"
              v-model="form.content">
          </el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="bohui">驳 回</el-button>
        <el-button type="primary" @click="shenpi">审 批</el-button>
      </div>
    </el-dialog>

  </div>
</template>

<script>
export default {
  name: "LeaveDBView",
  data() {
    return {
      tableDBdata:[],
      formInline:{},
      form:{},
      dialogFormVisible:false,
      formLabelWidth:'120px',
      jiangshi:[],
      daoyuan:[],
      roleName:'',
      hh:true,
      jj:true,

    }
  }, methods: {
    list() {
      this.axios.post("/service/leaves/list",this.formInline).then(res=>{
        console.log(res.data.data);
        this.tableDBdata=res.data.data;

      })
    },
    handleClick(id){
      this.axios.post("/service/leaves/getLeave?id="+id).then(res=>{
        console.log(res.data);
      })
      this.form={};
      this.form.id=id;
      this.dialogFormVisible=true;
    },
    getDaoyuan() {
      this.axios.post("/service/leaves/getDaoyuan").then(res=>{
        this.daoyuan=res.data.data;
      })
    },
    getJiangshi() {
      this.axios.post("/service/leaves/getJiangshi").then(res=>{
        this.jiangshi=res.data.data;
      })
    },
    hidden1() {
      var item = sessionStorage.getItem('roleName');
      console.log(item)
      if(item=='jiangshi' || item=='banzhang' || item=='daoyuan') {
        this.jj=false;
      } else {
        this.jj=true;
      }
    },
    hidden() {
      var item = sessionStorage.getItem('roleName');
      console.log(item)
      if(item=='jiangshi' ||item=='daoyuan') {
        this.hh=false;
      } else {
        this.hh=true;
      }
    },
    shenpi() {
      this.axios.post("/service/leaves/shenpi", this.form).then(res => {
        if (res.data.code == 200) {
          this.$message({
            message: '审批成功',
            type: 'success'
          });
          this.dialogFormVisible = false;
          this.list();
        }
      })
    },
    bohui(){

    }
  }, created() {
    this.list();
    this.getDaoyuan();
    this.getJiangshi();
    this.hidden();
    this.hidden1();
  }
}
</script>

<style scoped>

</style>